<template>
  <div class="container">
    <el-drawer
      v-model="show_engineerVersion_box"
      direction="rtl"
      size="60%"
      destroy-on-close
      @close="$emit('close')"
      :close-on-click-modal="false"
    >
      <template #title> <h4>工程版本管理</h4></template>
      <template #default>
        <el-button type="primary" @click="show_add_engineerVersion_box = true"
          >新增版本</el-button
        >
        <el-table
          :data="list"
          border
          class="tc m_top10"
          :loading="loading"
          max-height="600px"
        >
          <el-table-column
            label="版本号"
            prop="versionNum"
            sortable
          ></el-table-column>
          <el-table-column label="操作" width="250px">
            <template #default="scope: any">
              <el-button @click="edit_list({ item: scope.row, type: 1 })"
                >编辑</el-button
              >
              <el-button @click="edit_list({ item: scope.row, type: 2 })"
                >删除</el-button
              >
            </template>
          </el-table-column>
        </el-table>
      </template>
    </el-drawer>
    <el-drawer
      v-model="show_add_engineerVersion_box"
      direction="rtl"
      size="30%"
      destroy-on-close
      @close="
        ;((add_form_data.baseMapUrl = []), (add_form_data.id = '')),
          (show_add_engineerVersion_box = false)
      "
    >
      <template #title
        ><h4 v-if="add_form_data.id == ''">新增</h4>
        <h4 v-else>编辑</h4>
      </template>
      <template #default>
        <div class="flex_start">
          <div><span style="color: brown">*</span> 版本底图（rar,zip,7z）</div>
          <upload
            class="m_left20"
            :imageUrl="add_form_data.baseMapUrl"
            :width="100"
            :height="100"
            :limit="1"
            :uploadUrl="serviceApi.szls_engineeringVersion_upload_baseMap"
            :downloadUrl="serviceApi.szls_engineeringVersion_download_baseMap"
            :accept="'rar,zip,7z'"
            :fileNames="['版本底图']"
          ></upload>
        </div>

        <div class="tr m_top10">
          <el-button
            @click="
              ;((add_form_data.baseMapUrl = []), (add_form_data.id = '')),
                (show_add_engineerVersion_box = false)
            "
            >取消</el-button
          >
          <el-button type="primary" @click="submit" :loading="btn_loading"
            >确定
          </el-button>
        </div>
      </template>
    </el-drawer>
  </div>
</template>

<script lang="ts" setup>
import { onMounted, ref, watch } from 'vue'
import upload from '@/view/components/upload.vue'
import axios from '@/service/HttpRequest'
import serviceApi from '@/service/api'
import { ElMessage, ElMessageBox } from 'element-plus'
const props = defineProps({
  show_engineerVersion_box: {
    type: Boolean,
    default: false,
  },
  engineeringId: {
    type: String,
    default: false,
  },
})

const show_add_engineerVersion_box = ref(false)
const page_data = ref({
  current: 1,
  pageSize: 1000,
  engineeringId: props.engineeringId,
  versionNum: '',
})
const list = ref([])
const loading = ref(false)
const btn_loading = ref(false)
const add_form_data = ref({
  id: '',
  baseMapUrl: [],
  engineeringId: '',
})
watch(
  () => props.show_engineerVersion_box as any,
  () => {
    add_form_data.value.engineeringId = props.engineeringId
    page_data.value.engineeringId = props.engineeringId
    get_list()
  }
)
const get_list = () => {
  loading.value = true
  axios
    .request({
      url: serviceApi.szls_engineeringVersion_list,
      method: 'post',
      data: page_data.value,
    })
    .then((res) => {
      loading.value = false
      list.value = res.data.content
    })
    .catch((err) => {
      ElMessage.error(err)
    })
}
const edit_list = (e) => {
  if (e.type == 1) {
    add_form_data.value = {
      id: e.item.id,
      baseMapUrl: [e.item.baseMapUrl],
      engineeringId: props.engineeringId,
    }
    show_add_engineerVersion_box.value = true
  } else {
    ElMessageBox.confirm('确定删除该版本？', '', {
      cancelButtonText: '取消',
      confirmButtonText: '确定',
      closeOnClickModal: false,
      type: 'warning',
    })
      .then(() => {
        axios
          .request({
            url: serviceApi.szls_engineeringVersion_crud + '/' + e.item.id,
            method: 'delete',
          })
          .then(() => {
            ElMessage.success('操作成功！')
            setTimeout(() => {
              get_list()
            }, 1000)
          })
          .catch((err) => {
            ElMessage.error(err)
          })
      })
      .catch(() => {})
  }
}
const submit = () => {
  if (!add_form_data.value.baseMapUrl.length) {
    ElMessage.error('请上传底图！')
    return
  }
  if (btn_loading.value) return
  btn_loading.value = true
  let data = JSON.parse(JSON.stringify(add_form_data.value))
  data.baseMapUrl = data.baseMapUrl.toString()
  axios
    .request({
      url:
        data.id == ''
          ? serviceApi.szls_engineeringVersion_crud
          : serviceApi.szls_engineeringVersion_crud + '/' + data.id,
      method: data.id == '' ? 'post' : 'put',
      data: data,
    })
    .then(() => {
      ElMessage.success('操作成功！')
      show_add_engineerVersion_box.value = false
      btn_loading.value = false
      add_form_data.value = {
        id: '',
        baseMapUrl: [],
        engineeringId: add_form_data.value.engineeringId,
      }
      get_list()
    })
    .catch((err) => {
      btn_loading.value = false
      ElMessage.error(err)
    })
}
</script>

<style lang="scss" scoped></style>
